<template>
    <div class="select_speaker">
        <base-search placeholder="请输入讲者姓名、医院、科室搜索" @search="getSpeakerList"></base-search>
        <div class="vol_meeting_list">
            <van-list
                v-model:loading="loading"
                :finished="true"
            >
                <van-empty
                    v-if="speakerList.length==0"
                    image="//projectimg-1256680128.cos.ap-beijing.myqcloud.com/lpm/bd4d50fd-1214-423a-bbe8-2bc72dbd45b3.png"
                    image-size="80"
                    description="没有搜索到对应的讲者"
                />
                <van-cell v-for="(item, index) in speakerList" 
                :key="`indexitemspeaker${index}`" 
                :title="item.name" 
                :value="item.department" 
                :label="item.hospital" 
                is-link
                @click="speakerSelected(item)"
                />
            </van-list>  
        </div> 
          

    </div>
</template>
<script>
import { inject } from "vue";
export default {
    props: ['list'],
    setup() {
        const api = inject('api')
        return {
            api
        }
    },
    data() {
        return {
            loading: false,
            speakerList: []
        }
    },
    mounted() {
        this.speakerList = this.list
    },
    methods: {
        speakerSelected(item) {
            this.$emit('selected', item)
        },
        getSpeakerList(val) {
            this.api.speakerList({
                limit: 20,
                isAll: true,
                page: 1,
                search: val,
                status: 1
            }).then(res => {
                if (res.code === 0) {
                    this.speakerList = res.data
                }
            })
            
        }
    }
}
</script>

<style scoped lang="less">
.select_speaker {
    .vol_meeting_list {
        max-height: 70vh;
        overflow-y: auto;
    }
}
    
</style>